body
  min-height: 100vh
  background-color: var(--color-bg)
  h1, h2, h3, h4, h5, p
    color: var(--color-text)

#app
  .navbar
    background-color: var(--theme-color)

    .site-name
      color: #fff

    .nav-links, a
      color: #fff
      border-color: #fff

    .links
      background-color: transparent !important

    .nav-dropdown
      a
        color: #2c3e50

        &:hover
          color: var(--theme-color)

    button
      color: #fff

  .sidebar-heading, a.sidebar-link
    color: var(--color-text)
  a.sidebar-link:hover
    color: var(--theme-color)

.sidebar
  background-color: var(--color-bg)

.custom-block
  &.tip
    border-color: var(--theme-color)

  &.details
    background-color: #fafafa

    p
      margin-top: 20px
      padding: 20px
      box-sizing: border-box
      border: 1px solid #ebebeb
      border-radius: 3px
      font-size: 14px
      line-height: 22px
      color: #666
      word-break: break-word
      background-color: #fff

.demo-block
  .cq-row
    font-size: 0
    margin-bottom: 20px

    &:last-child
      margin-bottom: 0

    >*
      margin-right: 10px

      &:last-child
        margin-right: 0

  .cq-input
    width: 180px

  .cq-input--group
    width: 100%
